<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script src="./jquery.js"></script>
	<script src="./jquery.dialog.js"></script>
	<link rel="stylesheet" href="./theme/default/dialog.css">
	<script>
	$(function(){
		$('#test1').click(function(){
			$.dialog('显示隐藏',{
				title : 'test1',
				effect : 'visibility',
				cache : 'test',
				width : 320,
				height : 200
			});
		});
		$('#test2').click(function(){
			$.dialog('淡入淡出',{
				title : 'test2',
				effect : 'opacity',
				width : 320,
				height : 200
			});
		});
		$('#test3').click(function(){
			$.dialog('垂直划入',{
				title : 'test3',
				effect : 'scroll',
				cache : 'testaaaa',
				width : 320,
				height : 200
			});
		});
		$('#test4').click(function(){
			$.dialog('弹出一段话',{
				title : 'test4',
				effect : 'scroll',
				width : 320,
				height : 200
			});
		});
		$('#test5').click(function(){
			$.dialog.iframe('./iframe.html',{
				title : 'test5',
				effect : 'scroll',
				width : 320,
				height : 200
			});
		});
		$('#test6').click(function(){
			$.dialog.load('./load.html',{
				title : 'test6',
				effect : 'scroll',
				width : 320,
				height : 200
			});
		});
		$('#test7').click(function(){
			$.dialog.success('成功内容',function(){
				alert('成功关闭回调')
			});
		});
		$('#test8').click(function(){
			$.dialog.error('错误内容',function(){
				alert('错误关闭回调')
			});
		});
		$('#test9').click(function(){
			$.dialog.alert('提示内容',function(){
				alert('确认回调')
			});
		});
		$('#test10').click(function(){
			$.dialog.confirm('确认内容',function(action){
				if(action == 1){
					alert('确定')
				}else{
					alert('取消')
				}
			});
		});
		$('#test11').click(function(){
			$.dialog.loading('等待加载...');
		});
		$('#test12').click(function(){
			$.dialog.get('loading').close();
		});
		$('#test13').click(function(){
			$.dialog('测试的东西1',{
				width: 300,
				title : 'test',
				height: 300,
				mask : false
			});
		});
		$('#test14').click(function(){
			$.dialog('测试的东西2',{
				width: 300,
				title : 'test',
				height: 300,
				mask : false
			});
		});
		$('#test15').click(function(){
			$.dialog('测试的东西3',{
				width: 300,
				title : 'test',
				height: 300,
				mask : false
			});
		});
	})
	</script>
</head>
<body>
	<h3>3中打开方式</h3>
	<p>
		<a id="test1" href="javascript:;">显示隐藏</a>&#12288;&#12288;
		<a id="test2" href="javascript:;">淡入淡出</a>&#12288;&#12288;
		<a id="test3" href="javascript:;">垂直划入</a>&#12288;&#12288;
	</p>
	<h3>多种打开内容方式</h3>
	<p>
		<a id="test4" href="javascript:;">普通方式</a>&#12288;&#12288;
		<a id="test5" href="javascript:;">iframe方式</a>&#12288;&#12288;
		<a id="test6" href="javascript:;">load方式</a>&#12288;&#12288;
	</p>
	<h3>常用快捷弹出方式</h3>
	<p>
		<a id="test7" href="javascript:;">成功</a>&#12288;&#12288;
		<a id="test8" href="javascript:;">错误</a>&#12288;&#12288;
		<a id="test9" href="javascript:;">提示</a>&#12288;&#12288;
		<a id="test10" href="javascript:;">确认</a>&#12288;&#12288;
		<a id="test11" href="javascript:;">等待</a>&#12288;&#12288;
		<a id="test12" href="javascript:;" style="position: fixed; z-index: 100000;">关闭等待</a>&#12288;&#12288;
	</p>
	<h3>多个弹出层控制</h3>
	<p>
		<a id="test13" href="javascript:;">新增1</a>
		<a id="test14" href="javascript:;">新增2</a>
		<a id="test15" href="javascript:;">新增3</a>
	</p>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
	<br/>
</body>
</html>